<script setup>
    import footerVue from "../p2c/footer.vue";
    import headerVue from "../p2c/header.vue";
    import { reactive } from "vue";

    // const propsWeb = {
    //     user: 10,
    //     url: "www.baidu.com"
    // }
    // 响应式对象，变化后页面会进行渲染
    const propsWeb = reactive({
        user: 10,
        url: "www.baidu.com"
    })

    const userAdd = () => {
        propsWeb.user++;
        console.log("user number: ", propsWeb.user);
    }

</script>

<template>
    <!-- <headerVue v-bind="propsWeb" /> -->
    <headerVue pname="laoda" purl="laoda.com" />
    
    www.baidu.com

    <button @click="userAdd">添加用户</button>

    <footerVue :="propsWeb" />
</template>
<style scoped>

</style>